<template name="rentCar">
	<view class="rent-car" @click="createOrder">
		<image src="https://img-cdn-qiniu.dcloud.net.cn/uniapp/uni-ui/goodsnav/carts.png" mode="aspectFill"></image>
    <text>{{goods.length || 0}}</text>
	</view>
</template> 

<script>
import {broadcast} from '@/utils/index.js'
import {Order} from '@/apis/index.js'

	export default {
    name: 'rentCar',
		data() {
			return {
				goods: []
			}
		},
    props: {
      shopId: {
        type: Number,
        value: 0
      }
    },
    methods: {
      createOrder () {
        if (!this.goods.length) {
          uni.showToast({
            title: '租赁车空空如也～',
            icon: 'none'
          })
          return
        }
        if (this.isLoading) return
        // 判断是否已经登录
        const userInfo = uni.getStorageSync('userInfo')
        if (!userInfo.openid) {
          uni.showModal({
            confirmText: '去登录',
            confirmColor: '#FF4A4A',
            content: '您还没有登录，是否现在要去登录',
            success: res => {
              console.log('去购物车', res)
              if (res.cancel) return
              uni.redirectTo({
                url: `/pages/userCenter/userCenter`
              })
            }
          })
          return
        }
        this.isLoading = true
        uni.showLoading({
          title: '加载中...',
          mask: true,
        })
        Order.createOrder({
          data: {
            form: {
              shopId: this.shopId,
              goodsIds: this.goods.map(item => item.id).join(','),
              userId: uni.getStorageSync('userInfo').id
            },
            query: {},
            pagination: {}
          }
        }).then(res => {
          console.log('创建订单成功')
          console.log(res)
          uni.hideLoading()
          if (res.data.code !== 200) {
            uni.showToast({
              title: res.data.message,
              icon: 'none'
            })
            return
          }
          uni.navigateTo({
            url: `/pages/rentCar/rentCar?number=${res.data.body.orderNumber}`
          })
        }, err => {
          uni.showToast({
            title: '创建订单失败',
            icon: 'none'
          })
        }).finally(() => {
          this.isLoading = false
        })
      }
    },
    mounted () {
      const goods = uni.getStorageSync('carGoods')
      this.goods = goods
      broadcast.on('addToCar', () => {
        const goods = uni.getStorageSync('carGoods')
        this.goods = goods
      })
    },
	}
</script>

<style lang="scss">
.rent-car {
  position: fixed;
  right: 30rpx;
  bottom: 300rpx;
  width: 114rpx;
  height: 114rpx;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #FFF;
  box-shadow:0px 3px 7px 0px rgba(0, 0, 0, 0.35);
  image {
    width: 56rpx;
    height: 50rpx;
  }
  text {
    position: absolute;
    right: 15rpx;
    top: 22rpx;
    width: 30rpx;
    height: 30rpx;
    text-align: center;
    line-height: 30rpx;
    font-size: 16rpx;
    background-color: #F00;
    color: #FFF;
    border-radius: 50%;
    
  }
}
</style>
